import DefaultTheme from 'vitepress/theme'
import VPNavBarTitle from './components/VPNavBarTitle.vue'
import exportArticle from './components/ExportArticle.vue'
import { h, App } from 'vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import './scss/index'

const globalModules = import.meta.globEager('../components/*.vue')
const exampleModules = import.meta.globEager('@/**/examples/*.vue')
const modules = { ...globalModules, ...exampleModules }

export default {
  ...DefaultTheme,
  Layout: () => {
    return h(<any>DefaultTheme.Layout, null, {
      'navbar-title': () => h(VPNavBarTitle),
      'aside-top': () => h(exportArticle)
    })
  },
  enhanceApp({ app }: { app: App }) {
    for (const key in modules) {
      let module: any = modules[key]
      const name = module.default?.name || key.match(/\/([\w,-]*).vue$/)?.[1]
      app.component(name, module.default)
    }
    app.use(ElementPlus)
    for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
      app.component(key, <any>component)
    }
  }
}
